<template>
    <div align="center">
      <el-form :rules="rules" :ref="editFormId" :model="formData" label-position="left"
               label-width="70px" v-loading="formLoadding" >
		 <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>栏目信息</span>
          </div>
          <div class="text item">
				<el-row>
					<el-col :span="11"  class="form-view-col">
						 <el-form-item label="名称" placeholder="请输入名称" prop="name" label-width="85px">
						  <el-input v-model="formData.name"></el-input>
						</el-form-item>
					 </el-col>
					<el-col :span="2"  >&nbsp;</el-col>
					<el-col :span="11"  class="form-view-col">
						 <el-form-item label="编码" placeholder="请输入编码" prop="code" label-width="85px">
						  <el-input v-model="formData.code"></el-input>
						</el-form-item>
					 </el-col>
				 </el-row>

				<el-row>
          <el-col :span="11"  class="form-view-col">
						 <el-form-item label="排序" placeholder="请输入排序" prop="position" label-width="85px">
						  <el-input v-model="formData.position"></el-input>
						</el-form-item>
					 </el-col>
					<el-col :span="2"  >&nbsp;</el-col>
					<el-col :span="11"  class="form-view-col">
						 <el-form-item label="备注" placeholder="请输入备注" prop="remark" label-width="85px">
						  <el-input v-model="formData.remark"></el-input>
						</el-form-item>
					 </el-col>
				 </el-row>

				<el-row>
            <el-col :span="24"  class="form-view-col">
              <el-form-item label="父结点" placeholder="请选择父结点" prop="parentId" label-width="85px">
                <fieldset>
                  <legend>请选择父权限结点</legend>
                    <el-tree
                      v-model="formData.parentId"
                      :data="parentTreeData"
                      show-checkbox
                      check-strictly
                      :defaultExpandAll="true"
                      node-key="key"
                      :default-checked-keys="[formData.parentId]"
                      :props="parentTreeDefaultProps"
                      ref="treeForm"
                      @check-change="handleParentTreeClick">
                    </el-tree>
                </fieldset>
              </el-form-item>
            </el-col>
        </el-row>
		  </div>
        </el-card>
      </el-form>
      <div slot="footer" align="center">
        <el-button @click="changeDialogVisible(false)">取消</el-button>
        <el-button v-if="formOpration=='create'" type="primary" @click="createData">确认</el-button>
        <el-button v-else type="primary" @click="updateData">确认</el-button>
      </div>
    </div>
</template>

<script src="./ColumnEdit.js"></script>

